<template>
  <div class="contest-data">
    <el-tabs type="border-card">
      <el-tab-pane label="竞赛问题"><ContestProblem /></el-tab-pane>
      <el-tab-pane label="竞赛状态"><ContestStatus /></el-tab-pane>
      <el-tab-pane label="竞赛排名"><ContestRank /></el-tab-pane>
      <el-tab-pane label="竞赛统计"><ContestCount /></el-tab-pane>
      <el-tab-pane label="竞赛打印">竞赛打印</el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import { defineAsyncComponent } from '@vue/runtime-core';

export default {
  components: {
      ContestProblem: defineAsyncComponent(() => import('@/components/Problem/ProblemList.vue')),
      ContestStatus: defineAsyncComponent(() => import('@/components/Solution/SolutionList.vue')),
      ContestRank: defineAsyncComponent(() => import('@/components/Contest/ContestRank.vue')),
      ContestCount: defineAsyncComponent(() => import('@/components/Contest/ContestCount.vue')),
  },
    data() {
        return {

        }
    }
}
</script>

<style scoped>
  .contest-data {
    width: 80%;
    max-width: 1200px;
    margin: 70px auto;
}
@media screen and (max-width: 1000px){
    .contest-data {
        width: 100%;
    }
}
</style>